<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1, user-scalable=0, minimal-ui">
    <title></title>
</head>
<style>
body{
    text-align: center;
}
button {
  background: none;
  border: 0;
  box-sizing: border-box;/*border和padding全会在你设置的宽高内部*/
  margin: 1em;
  padding: 1em 2em;
  box-shadow: inset 0 0 4px 3px plum;/*inset内阴影。该参数可选，不设的话默认是外阴影。*/
  color: blue;
  font-size: inherit;
  font-weight: 700;
  position: relative;
}
  button::before,
  button::after {
    box-sizing: inherit;/*继承父的*/
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
  }
<!--.draw {-->
    <!--transition: color 2s;/*字体颜色出现渐变一个用时2s*/-->
    <!--}-->
  <!--.draw::before,-->
  <!--.draw::after {-->
    <!--border: 2px solid transparent;/*边框设置为透明的*/-->
    <!--width: 0;-->
    <!--height: 0;-->
  <!--}-->
  <!--.draw::before {-->
    <!--top: 0;-->
    <!--left: 0;-->
  <!--}-->
  <!--.draw::after {-->
    <!--bottom: 0;-->
    <!--right: 0;-->
  <!--}-->
  <!--.draw:hover {-->
    <!--color: black;-->
  <!--}-->
  <!--.draw:hover::before,-->
  <!--.draw:hover::after {-->
    <!--width: 100%;-->
    <!--height: 100%;-->
  <!--}-->
  <!--.draw:hover::before {-->
    <!--border-top-color: red;-->
    <!--border-right-color: red;-->
    <!--transition:-->
      <!--width 0.25s ease-out, /*ease-out是结束是慢的*/-->
      <!--height 0.25s ease-out 0.25s;-->
  <!--}-->
  <!--.draw:hover::after {-->
    <!--border-bottom-color: red;-->
    <!--border-left-color: red;-->
    <!--transition:-->
      <!--width 0.25s ease-out 0.5s,-->
      <!--height 0.25s ease-out 0.75s;-->
  <!--}-->

  .tt {
    border:1px solid #F00
  }
  .tt:hover{
    border:1px solid #000
  }
   .tt:before,
   .tt:after{
    border:1px solid #F00
  }
</style>
<body onload="JsHandler()">
<script type="text/javascript" src="/res/common/js/jquery.js"></script>

<p><input type="button" id="enter1" style="width:480px;height:270px;" value="视频默认播放" onclick="play();"/></p>

<p><input type="button" id="enter2" value="全屏播放" onclick="fullPlay();"/></p>

<p><input type="button" id="enter" value="返回上一级" onclick="back();"/></p>
<!--<p><a href=http://www.baidu.com>跳转百度</a></p>-->

<!--<button class="draw">Draw border</button>-->

<!--<div class="tt">tttt</div>-->

<!--<video id="myvideo" src="http://s.61baobao.com/mobile/res/01_syz.mp4" webkit-playsinline="true"></video>-->
<script>

    var default_data = {
        error: "1"
    };

    var connectMerchantJSBridge = function (callback) {
        try {
            if (window.TestJavascriptBridge) {
                callback(TestJavascriptBridge);
            } else {
                document.addEventListener("TestJavascriptBridgeReady", function () {
                    callback(TestJavascriptBridge);
                }, false);
            }
        } catch (ex) { }
    };

    var cmbMerchantBridge = {
        initSignNet: function (payData,name) {
            if (!payData) {
                payData = default_data;
            }
            connectMerchantJSBridge(function (bridge) {
                if (typeof bridge === "undefined") {
                    return;
                }
                bridge.callHandler(name, JSON.stringify(payData));
            });
        },
    };

    /*app native调用本页面方法*/
    connectMerchantJSBridge(function(bridge) {
        bridge.init(function(message, responseCallback) {

        });

        bridge.registerHandler("click1", function(data, responseCallback) {
            responseCallback("receive click1");
            /*弹窗*/
            dialog();
        });

        bridge.registerHandler("click2", function(data, responseCallback) {
            responseCallback("receive click2");
        });

         bridge.registerHandler("click3", function(data, responseCallback) {
            responseCallback("receive click3");
        });
    })

    window.cmbMerchantBridge = cmbMerchantBridge;

function click2(){
        var objData = new datas();
        var shareData = objData.click2;

        try {
            cmbMerchantBridge.initSignNet(shareData, "initSignNetShare");
        } catch (ex) { }
    }

 function back()
    {
        window.history.back(); return false;
    }

    function play(){
    <!--alert("播放/暂停/重新播放");-->
        var objData = new datas();
        var payData = objData.click1;
            try {
                cmbMerchantBridge.initSignNet(payData, "play");
            } catch (ex) { }
    }

function fullPlay(){
    <!--alert("全屏播放");-->

        var objData = new datas();
        var payData = objData.click1;
            try {
                cmbMerchantBridge.initSignNet(payData, "fullPlay");
            } catch (ex) { }
}

 function Goto()
 {
     window.location.href="http://www.baidu.com";
 }

 /*弹窗*/
    function dialog()
    {
        click2();
    }

    <!-- 这个是本地测试方法，实际使用使用以上两个方法 -->
    function JsHandler(){
     var objData = new datas();
        var handlerData = objData.handlerData;
        cmbMerchantBridge.initSignNet(handlerData, "jsHandler1");

        cmbMerchantBridge.initSignNet(handlerData, "jsHandler2");
    }


function datas()
    {

        this.click1 = {
            title: "hello title",
            play_url:"",
            play_pos:0,
            play_list:"",
        };

        this.click2 = {
            subject : "this is title",
        };

        this.handlerData = {
            status : "ok"
        }
    }

</script>

</body>
</html>